import { HowToImport } from './HowToImport.js'
import { BasicUsage } from './BasicUsage.js'
import { Props } from './Props.js'
import { Methods } from './Methods.js'
import { FormItemDesc } from './FormItemDesc.js'

import { NavBar } from '../Nav.js'

export const VFormCocs = {
  components: {
    HowToImport,
    BasicUsage,
    NavBar,
    Props,
    Methods,
    FormItemDesc
  },
  template: `
    <div class="content">
      <how-to-import />
      <basic-usage />
      <props />
      <methods />
      <form-item-desc />
      <nav-bar />
    </div>
  `,
  mounted() {
    document.querySelectorAll('pre code').forEach((el) => {
      window.hljs.highlightElement(el);
    });
  },
}